import React from 'react'

/**
 * 非受控组件, 通过ref操作DOM的方式获取到值
 */
class Handler extends React.Component {
  constructor() {
    super()
    // 1. 通过React.createRef()方法创建一个ref对象
    this.valRef = React.createRef()
  }
  changeVal = () => {
    // 3. 通过实例对象this.ref调用current即可
    console.log(this.valRef.current.value)
  }
  render() {
    return (
      // 2. 给表单元素添加一个onChange事件
      <input type="text" ref={this.valRef} onChange={ this.changeVal }/>
    )
  }
}

export default Handler